<template>
  <card ref="Card">
    <div slot="header">
      <search-select-all @get="get" :except-site="$user.username"/>
      <el-input placeholder="输入单号搜索" v-model="search.number" class="ml-5 w-175" clearable @keyup.enter.native="getData"/>
      <el-select v-model="search.type" class="ml-5 w-150" placeholder="类型" clearable>
        <el-option v-for="item in options" :label="item.label" :value="item.value" :key="item.key"/>
      </el-select>
      <date-time-picker class="ml-5" :start.sync="search.beginTime" :end.sync="search.endTime"/>
      <el-button type="success" @click="getData" class="ml-10">搜索</el-button>
      <export-bill class="float-right" :options="options"/>
    </div>
    <el-table :data="formData">
      <el-table-column prop="price" label="金额"/>
      <el-table-column prop="type" label="类型">
        <template slot-scope="scope">
          <span>{{getLabel(scope.row.type)}}</span>
        </template>
      </el-table-column>
      <el-table-column prop="number" label="关联单号"/>
      <el-table-column prop="linkUsername" label="关联网点"/>
      <el-table-column prop="createTime" label="时间">
        <template slot-scope="scope">
          <span>{{scope.row.createTime | formatDateTime}}</span>
        </template>
      </el-table-column>
      <el-table-column prop="notes" label="备注"/>
      <el-table-column prop="balance" label="余额"/>
    </el-table>
    <pagination ref="Pagination" @update="getData"/>
  </card>
</template>

<script>
  import {pageFundRecordsApi} from '@/api/fund';
  import {delNullKey} from "@/utils/common";
  import SearchSelectAll from "@/views/components/SearchSelectAll";
  import DateTimePicker from "@/components/DateTimePicker";
  import ExportBill from "@/views/export/ExportBill";

  export default {
    name: "FundFlow",
    components: {DateTimePicker, SearchSelectAll, ExportBill},
    data() {
      return {
        formData: [],
        options: [
          {value: 0, label: '充值'},
          {value: 1, label: '扣除'},
          {value: 2, label: '订单揽收'},
          {value: 3, label: '运费'},
          {value: 4, label: '订单中转'},
          {value: 5, label: '订单签收'},
          {value: 6, label: '快递运输超时'},
          {value: 7, label: '延时不操作'},
          {value: 8, label: '问题件处理'},
          {value: 9, label: '揽收佣金'},
          {value: 10, label: '中转佣金'},
          {value: 11, label: '签收佣金'},
          {value: 12, label: '问题件超时未处理'},
        ],
        search: {
          linkUserName: '',
          number: '',
          beginTime: null,
          endTime: null,
          type: null
        }
      }
    },
    mounted() {
      this.getData()
    },
    methods: {
      get(obj) {
        if (obj) this.search.linkUserName = obj.username
        else this.search.linkUserName = ''
        this.getData()
      },
      getData() {
        let pagination = this.$refs.Pagination;
        let param = {
          current: pagination.current,
          size: pagination.size,
          linkUserName: this.search.linkUserName,
          number: this.search.number,
          beginTime: this.search.beginTime,
          endTime: this.search.endTime,
          type: this.search.type
        };
        delNullKey(param)
        this.$refs.Card.start();
        pageFundRecordsApi(param).then(result => {
          let response = result.resultParam.fundRecordsPage;
          this.formData = response.records;
          pagination.total = response.total;
          this.$refs.Card.stop();
        })
      },
      getLabel(type) {
        let label = ''
        this.options.some(item => {
          if (item.value === type) {
            label = item.label
            return true
          }
        })
        return label
      }
    }
  }
</script>
